//引入路由api
import { createRouter, createWebHashHistory } from 'vue-router'

//引入页面
const Home = () => import('../views/Home.vue')
const About = () => import('../views/About.vue')
const Usercenter = () => import('../views/user-center/index.vue')
const UserProfile = () => import('../views/user-center/Profile.vue')
const UserSettings = () => import('../views/user-center/Settings.vue')
//引入vuex页面
const store = () => import('../views/Vuex.vue')
//引入ElementTest页
const ElementTest = () => import('../views/ElementTest.vue')
//引入ListPage页
const ListPage = () => import('../views/ListPage.vue')
//引入Register页
const Register = () => import('../views/Register.vue')
//引入AccountList页
const AccountList = () => import('../views/AccountList.vue')

const routes = [
    { path: '/', redirect: '/home' },
    { path: '/home', name: 'home', component: Home },
    { path: '/about', name: 'about', component: About },

    {
        path: '/user', name: 'user', component: Usercenter,
        redirect: '/user/profile',
        children: [{
            path: '/profile',
            name: 'profile',
            component: UserProfile,
        },
        {
            path: '/settings',
            name: 'settings',
            component: UserSettings,
        }],
    },
    {
        path: '/store',
        name: 'store',
        component: store,
    },
    {   //ElementTest
        path: '/element',
        name: 'ElementTest',
        component: ElementTest,
    },
    {   //ListPage
        path: '/ListPage',
        name: 'ListPage',
        component: ListPage,
    },
    {   //Register
        path: '/Register',
        name: 'Register',
        component: Register,
    },
    {   //AccountList
        path: '/AccountList',
        name: 'AccountList',
        component: AccountList,
    },
]

//创建vuerouter实例并配置
const router = createRouter({
    history: createWebHashHistory(),
    routes,
})

//输出实例对象
export default router